import axios from 'axios'
import { Message } from 'element-ui'
import store from '@/store'
import { getToken } from '@/utils/auth'
import { getTime } from '@/utils/auth'
import router from '@/router'
const TimeOut = 3600

// 在axios底层的promise下增加一个基地址和请求延迟时间
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API, // 基地址
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 5000 // 请求延迟时间
})

// 响应拦截
// 此次请求时发现了无论怎么请求不会报错,只会存在请求成功和失败
service.interceptors.response.use(response => {
  // console.log(response.data);
  // 这里返回请求来的数据的data,可以让之后取数据时可以简单一点
  const res = response.data
  // 这里我们要返回请求成功的状态
  if (res.success) {
    return res
  } else {
    // Message.error()是一个弹窗组件的全局写法
    Message.error(res.message)
    // 返回请求错误的信息
    return Promise.reject(res.message)
  }
}, error => {
  console.dir(error);
  if (error.response.data.code === 10002) {
    store.dispatch('user/logout')
    Message.error('登录状态过期,请重新登陆!')
    router.push('/login')
  }
  return Promise.reject(error)
})

// 请求拦截
// 这个项目中需要多次使用token,而每多一次请求就多一次性能损耗,所以我们在请求拦截这里将数据获取到存储起来
service.interceptors.request.use(async request => {
  // console.log(request)
  // 这里有token就加token,没有就不加
  if (store.getters.token) {
    //这个地方token主动失效
    let timestamp = getTime()
    // console.log(timestamp);
    let timeNow = Date.now()
    let time = (timeNow - timestamp) / 1000
    // console.log(time);
    if (time >= TimeOut) {
      await store.dispatch('user/logout')
      // console.log(error);
      Message.error('登录已过期,请重新登录!')
      router.push('/login')
      return
    }
    request.headers['Authorization'] = 'Bearer ' + store.getters.token
  }
  return request
}, error => {
  return Promise.reject(error)
})

export default service
